<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<title>成功案例</title>
		<link rel="stylesheet" type="text/css" href="css/header.css" />
		<link rel="stylesheet" href="css/swiper.min.css" />
		<style>
			.carousel .swiper-button-white {
				height: 35px;
				background-color: #faac05;
				width: 25px;
				background-size: 15px 44px;
			}
			
			.carousel .swiper-button-next {
				right: 0;
			}
			
			.carousel .swiper-button-prev {
				left: 0;
			}
			
			.carousel {
				min-width: 1226px;
			}
			
			.subhead {
				width: 1100px;
				margin: 0 auto;
				font-size: 20px;
				font-weight: normal;
				padding: 50px 0 30px;
			}
			
			.more {
				font-size: 14px;
				text-decoration: underline;
				color: gray;
				font-weight: normal;
			}
			
			.product {
				width: 1226px;
				margin: 0 auto 60px;
			}
			
			.subhead a {
				margin-left: 60px;
			}
			
			.product_list {
				width: 1100px;
				margin: 0 auto;
				padding: 0 2.5%;
				position: relative;
			}
			
			.product_list .swiper-slide {
				box-sizing: border-box;
				/*background-color: #fafafa;*/
				padding: 10px;
				border: 1px solid transparent;
				border-bottom: 1px solid gainsboro;
			}
			
			.product_list .swiper-slide:hover {
				border: 1px solid gainsboro;
				box-shadow: 0px 0px 5px 0px gainsboro;
			}
			
			.product_list .swiper-slide img {
				width: 100%;
				margin-bottom: 20px;
			}
			
			.product_list .swiper-slide a {
				color: black;
				font-size: 18px;
			}
			
			.product_list .swiper-slide a:hover {
				text-decoration: underline;
				color: #4e80d9;
			}
			
			.product_list .swiper-slide p {
				color: gray;
				margin-top: 5px;
				margin-bottom: 10px;
			}
			
			.product_list .swiper-button-black {
				background-size: 20px 44px;
			}
			
			.product_list .swiper-button-prev {
				left: -40px;
			}
			
			.product_list .swiper-button-next {
				right: -40px;
			}
			
			.children_recure_wrap {
				min-width: 1226px;
				background-color: #f2f5f6;
			}
			
			.children_recure {
				width: 1226px;
				margin: 0 auto;
				padding-bottom: 100px;
			}
			
			.recure_content {
				width: 1100px;
				/*background-color: orange;*/
				margin: 0 auto;
				position: relative;
			}
			
			.recure_content img {
				float: right;
				width: 28%;
			}
			
			.recure_content ul {
				width: 70%;
			}
			
			.recure_content ul li {
				height: 40px;
			}
			
			.recure_content ul li a {
				color: black;
				font-size: 16px;
				/*padding-right: 130px;*/
				line-height: 40px;
			}
			
			.recure_content ul li a:hover {
				text-decoration: underline;
				color: #4e80d9;
			}
			
			.recure_content ul li span {
				color: gray;
				float: right;
				margin-right: 80px;
				line-height: 40px;
			}
			
			.adult_recure{
				min-width: 1226px;
			}
			
			.adult_recure .recure_content img {
				width: 25%;
				float: left;
				padding-bottom: 50px;
			}
			
			.adult_recure .recure_content ul {
				float: right;
			}
			
			.adult_recure .recure_content ul li {
				padding-left: 60px;
			}
			
			.adult_recure .recure_content ul li span {
				margin-right: 0px;
			}
			
			.industry_trends_wrap {
				clear: both;
				background-color: #f2f5f6;
				padding-bottom: 50px;
				margin-bottom: 200px;
				min-width: 1226px;
			}
			
			
			.trends_content{
				width: 1100px;
				margin: 0 auto;
				font-size: 0;
			}
			.trends_content>div{
				width: 50%;
				box-sizing: border-box;
				display: inline-block;
				/*padding-right: 5%;*/
				font-size: 16px;
			}
			.trends_content>div:first-child{
				border-right: 1px solid gainsboro;
				padding-right: 5%;
			}
			.trends_content>div:last-child{
				padding-left: 5%;
				height: 100%;
			}
			.trends_content>div h6{
				font-size: 18px;
				font-weight: normal;
			}
			.trends_content>div h6 span{
				color: gray;
				float: right;
				font-size: 16px;
			}
			.trends_content>div:first-child p{
				text-indent: 32px;
				margin-top: 20px;
				line-height: 32px;
				letter-spacing: 1px;
			}
			.trends_content>div p a{
				float: right;
				color: #96d610;
			}
			.trends_content ul{
				font-size: 16px;
			}
			.trends_content ul li span{
				float: right;
				color: grey;
			}
			.trends_content ul li{
				float: left;
				width: 100%;
				margin: 10px 0;
			}
			.trends_content ul li a{
				color: black;
			}
			.trends_content ul li a:hover {
				text-decoration: underline;
				color: #4e80d9;
			}
			.page {
				font-size: 14px;
				margin-top: 10px;
			}
			.page span{
				display: inline-block;
				margin-right: 5px;
				cursor: pointer;
			}
			.page span:hover {
				text-decoration: underline;
				color: #4e80d9;
			
			}
			.adult_recure .recure_content .page{
				float: right;
			}
			.industry_trends_wrap .page{
				float: right;
			}
		</style>
	</head>

	<body ng-app="">
		<div ng-include="'header.html'"></div>
		<div class="carousel">
			<div class="swiper-container swiper-container1">
				<div class="swiper-wrapper">
					<div class="swiper-slide"><img width="100%" src="img/swiper1.png" alt="" /></div>
					<div class="swiper-slide"><img width="100%" src="img/swiper1.png" alt="" /></div>
					<div class="swiper-slide"><img width="100%" src="img/swiper1.png" alt="" /></div>
					<div class="swiper-slide"><img width="100%" src="img/swiper1.png" alt="" /></div>
				</div>
				<!-- Add Pagination -->
				<div class="swiper-pagination"></div>
				<div class="swiper-button-next swiper-button-white"></div>
				<div class="swiper-button-prev swiper-button-white"></div>
			</div>
		</div>

		<div class="product">
			<h5 class="subhead">成功案例</h5>
			<div class="product_list">
				<div class="swiper-container swiper-container2">
					<div class="swiper-wrapper">
						<div class="swiper-slide">
							<img src="img/case1.png" />
							<a href="javaScript:void(0)">你给我以信任，我给你以希望......</a>
							<p>2017.01.1</p>
						</div>
						<div class="swiper-slide">
							<img src="img/case1.png" />
							<a href="javaScript:void(0)">你给我以信任，我给你以希望......</a>
							<p>2017.01.1</p>
						</div>
						<div class="swiper-slide">
							<img src="img/case1.png" />
							<a href="javaScript:void(0)">你给我以信任，我给你以希望......</a>
							<p>2017.01.1</p>
						</div>
						<div class="swiper-slide">
							<img src="img/case1.png" />
							<a href="javaScript:void(0)">你给我以信任，我给你以希望......</a>
							<p>2017.01.1</p>
						</div>
					</div>

					<div class="swiper-pagination"></div>

				</div>
				<div class="swiper-button-next swiper-button-black next2 "></div>
				<div class="swiper-button-prev swiper-button-black prev2"></div>
			</div>
		</div>
		<div class="children_recure_wrap">
			<div class="children_recure">
				<h5 class="subhead">儿童康复资讯</h5>
				<div class="recure_content">
					<img src="img/recure.png" />
					<ul>
						<li>
							<a href="javaScript:void(0)">生病、受伤要进医院治疗，这个道理谁都懂。可一旦出院，人们往往......</a>
							<span>2017.1.1</span>
						</li>
						<li>
							<a href="javaScript:void(0)">生病、受伤要进医院治疗，这个道理谁都懂。可一旦出院，人们往往......</a>
							<span>2017.1.1</span>
						</li>
						<li>
							<a href="javaScript:void(0)">生病、受伤要进医院治疗，这个道理谁都懂。可一旦出院，人们往往......</a>
							<span>2017.1.1</span>
						</li>
						<li>
							<a href="javaScript:void(0)">生病、受伤要进医院治疗，这个道理谁都懂。可一旦出院，人们往往......</a>
							<span>2017.1.1</span>
						</li>
						<li>
							<a href="javaScript:void(0)">生病、受伤要进医院治疗，这个道理谁都懂。可一旦出院，人们往往......</a>
							<span>2017.1.1</span>
						</li>
					</ul>
					<p class="page"><span>首页</span><span>上一页</span><span>下一页</span><span>末页</span></p>
				</div>
			</div>
		</div>

		<div class="adult_recure">
			<h5 class="subhead">成人康复资讯</h5>
			<div class="recure_content">
				<img src="img/recure1.png" />
				<ul>
					<li>
						<a href="javaScript:void(0)">生病、受伤要进医院治疗，这个道理谁都懂。可一旦出院，人们往往......</a>
						<span>2017.1.1</span>
					</li>
					<li>
						<a href="javaScript:void(0)">生病、受伤要进医院治疗，这个道理谁都懂。可一旦出院，人们往往......</a>
						<span>2017.1.1</span>
					</li>
					<li>
						<a href="javaScript:void(0)">生病、受伤要进医院治疗，这个道理谁都懂。可一旦出院，人们往往......</a>
						<span>2017.1.1</span>
					</li>
					<li>
						<a href="javaScript:void(0)">生病、受伤要进医院治疗，这个道理谁都懂。可一旦出院，人们往往......</a>
						<span>2017.1.1</span>
					</li>
					<li>
						<a href="javaScript:void(0)">生病、受伤要进医院治疗，这个道理谁都懂。可一旦出院，人们往往......</a>
						<span>2017.1.1</span>
					</li>
				</ul>
				<p class="page"><span>首页</span><span>上一页</span><span>下一页</span><span>末页</span></p>
			</div>
		</div>
		
		<div class="industry_trends_wrap">
			<div class="industry_trends">
				<h5 class="subhead">行业动态</h5>
				<div class="trends_content">
					<div>
						<h6>远程康复将会颠覆整个康复行业吗？<span>2017.1.1</span></h6>
						<p>十年前，马云说互联网时还被当作是骗子，十年后，人们几乎无法想象没有网购的生活。几年前远程康复还只停留在概念，现在速康智创已经率先竖起远程康复的大旗，所服务的患者遍布全国，获得康友们的一致认可。速康相信远程康复正在成为康复治疗不可或缺的手段之一......  <a href="javaScript:void(0)">[详情]</a> </p>
					</div>
					<div>
						<ul>
						<li>
							<a href="javaScript:void(0)">你给我以信任，我还你以希望——速康智创</a>
							<span>2017.1.1</span>
						</li>
						<li>
							<a href="javaScript:void(0)">你给我以信任，我还你以希望——速康智创</a>
							<span>2017.1.1</span>
						</li>
						<li>
							<a href="javaScript:void(0)">你给我以信任，我还你以希望——速康智创</a>
							<span>2017.1.1</span>
						</li>
						<li>
							<a href="javaScript:void(0)">你给我以信任，我还你以希望——速康智创</a>
							<span>2017.1.1</span>
						</li>
					</ul>
					<p class="page"><span>首页</span><span>上一页</span><span>下一页</span><span>末页</span></p>
					</div>
				</div>
			</div>
		</div>

	</body>
	<script src="js/angular.min.js" type="text/javascript" charset="utf-8"></script>
	<script src="js/jquery-1.8.3.min.js" type="text/javascript" charset="utf-8"></script>
	<script src="js/swiper.min.js" type="text/javascript" charset="utf-8"></script>
	<script type="text/javascript">
		//	轮播图1
		var swiper = new Swiper('.swiper-container1', {
			pagination: '.swiper-pagination',
			paginationClickable: true,
			nextButton: '.swiper-button-next',
			prevButton: '.swiper-button-prev'
				//     		autoplay:5000
		});

		//	轮播图2
		var swiper = new Swiper('.swiper-container2', {
			//      	pagination: '.swiper-pagination',
			slidesPerView: 3,
			paginationClickable: true,
			spaceBetween: 40,
			freeMode: true,
			nextButton: '.next2 ',
			prevButton: '.prev2'
		});
	</script>

</html>